/**
 * Tabslet jQuery plugin
 *
 * @copyright Copyright 2012, Dimitris Krestos
 * @license   Apache License, Version 2.0 (http://www.opensource.org/licenses/apache2.0.php)
 * @link    http://vdw.staytuned.gr
 * @version   v1.4.2
 */

/* Sample html structure

  <div class='tabs'>
    <ul class='horizontal'>
      <li><a href="#tab-1">Tab 1</a></li>
      <li><a href="#tab-2">Tab 2</a></li>
      <li><a href="#tab-3">Tab 3</a></li>
    </ul>
    <div id='tab-1'></div>
    <div id='tab-2'></div>
    <div id='tab-3'></div>
  </div>

  */

(function($, window, undefined) {
  $.fn.tabslet = function(options) {
    var defaults = {
      mouseevent: "click", //tab切换的事件
      attribute: "index", //关联属性
      animation: true, //是否产生动画效果
      autorotate: false, //自动切换
      pauseonhover: true, //鼠标悬停停止自动切换
      delay: 2000, //自动切换的时间间隔
      active: 1, //默认显示第几个
      controls: {
        prev: ".prev",
        next: ".next"
      }
    };
    var options = $.extend(defaults, options);
    return this.each(function() {
      var $this = $(this);
      options.mouseevent = $this.data("mouseevent") || options.mouseevent;
      options.attribute = $this.data("attribute") || options.attribute;
      options.animation = $this.data("animation") || options.animation;
      options.autorotate = $this.data("autorotate") || options.autorotate;
      options.pauseonhover = $this.data("pauseonhover") || options.pauseonhover;
      options.delay = $this.data("delay") || options.delay;
      options.active = $this.data("active") || options.active;
      $this.find("> div").hide();
      $this.find("> div").eq(options.active - 1).show();
      $this.find("> ul li").eq(options.active - 1).addClass("active");
      var fn = eval(function() {
        $(this).trigger("_before");
        $this.find("> ul li").removeClass("active");
        $(this).addClass("active");
        $this.find("> div").hide();
        var currentTab = $(this).find("a").attr(options.attribute);
        if (options.animation) {
          $this.find(currentTab).animate({
            opacity: "show"
          }, "slow", function() {
            $(this).trigger("_after")
          })
        } else {
          $this.find(currentTab).show();
          $(this).trigger("_after")
        }
        return false
      });
      var init = eval("$this.find('> ul li')." + options.mouseevent + "(fn)");
      init;
      var elements = $this.find("> ul li"),
        i = options.active - 1;

      function forward() {
        i = ++i % elements.length;
        options.mouseevent == "hover" ? elements.eq(i).trigger("mouseover") : elements.eq(i).click();
        var t = setTimeout(forward, options.delay);
        $this.mouseover(function() {
          if (options.pauseonhover) {
            clearTimeout(t)
          }
        })
      }
      if (options.autorotate) {
        setTimeout(forward, 0);
        if (options.pauseonhover) {
          $this.on("mouseleave", function() {
            setTimeout(forward, 1000)
          })
        }
      }

      function move(direction) {
        if (direction == "forward") {
          i = ++i % elements.length
        }
        if (direction == "backward") {
          i = --i % elements.length
        }
        elements.eq(i).click()
      }
      $this.find(options.controls.next).click(function() {
        move("forward")
      });
      $this.find(options.controls.prev).click(function() {
        move("backward")
      });
      $this.on("destroy", function() {
        $(this).removeData()
      })
    })
  };
  $(document).ready(function() {
    $('[data-toggle="tabslet"]').tabslet();
  });
})(jQuery);